// 视频卡片 - 水平布局
import 'package:flutter/material.dart';
import 'package:flutter_danmu_anim/common/constants.dart';
import 'package:flutter_danmu_anim/common/widgets/network_img_layer.dart';
import 'package:flutter_danmu_anim/common/widgets/stat/view.dart';
import 'package:flutter_danmu_anim/model/model_hot_video_item.dart';
import 'package:flutter_danmu_anim/utils/utils.dart';
import 'package:get/get.dart';

class VideoCardH extends StatelessWidget {
  final HotVideoItemModel videoItem;
  Function()? longPress;
  Function()? longPressEnd;

  VideoCardH({
    Key? key,
    required this.videoItem,
    this.longPress,
    this.longPressEnd,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    String heroTag = Utils.makeHeroTag(videoItem.aid);
    return Material(
      child: Ink(
        child: GestureDetector(
          onLongPress: () {
            longPress?.call();
          },
          onLongPressEnd: (details) {
            longPressEnd?.call();
          },
          child: InkWell(
            onTap: () async {
              await Future.delayed(const Duration(milliseconds: 200));
              int aid = videoItem.aid ?? 0;
              Get.toNamed('/video?aid=$aid',
                  arguments: {'videoItem': videoItem, 'heroTag': heroTag});
            },
            child: Container(
              padding: const EdgeInsets.fromLTRB(
                  StyleString.cardSpace, 5, StyleString.cardSpace, 5),
              child: LayoutBuilder(
                builder: (context, boxConstraints) {
                  double width =
                      (boxConstraints.maxWidth - StyleString.cardSpace * 6) / 2;
                  return SizedBox(
                    height: width / StyleString.aspectRatio,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        AspectRatio(
                          aspectRatio: StyleString.aspectRatio,
                          child: LayoutBuilder(
                            builder: (context, constraints) {
                              double maxWidth = boxConstraints.maxWidth;
                              double maxHeight = boxConstraints.maxHeight;
                              double PR =
                                  MediaQuery.of(context).devicePixelRatio;
                              return Stack(
                                children: [
                                  Hero(
                                    tag: heroTag,
                                    child: NetworkImgLayer(
                                      src: videoItem.pic ?? '' '@.webp',
                                      width: maxWidth,
                                      height: maxHeight,
                                    ),
                                  ),
                                  Positioned(
                                    right: 4,
                                    bottom: 4,
                                    child: Container(
                                      padding: const EdgeInsets.symmetric(
                                          vertical: 1, horizontal: 6),
                                      decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(4),
                                          color:
                                              Colors.black54.withOpacity(0.4)),
                                      child: Text(
                                        Utils.timeFormat(
                                            videoItem.duration ?? 0),
                                        style: const TextStyle(
                                            fontSize: 11, color: Colors.white),
                                      ),
                                    ),
                                  ),
                                ],
                              );
                            },
                          ),
                        ),
                        VideoContent(videoItem: videoItem),
                      ],
                    ),
                  );
                },
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class VideoContent extends StatelessWidget {
  final HotVideoItemModel videoItem;

  const VideoContent({super.key, required this.videoItem});

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: Padding(
        padding: const EdgeInsets.fromLTRB(10, 2, 6, 0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              videoItem.title ?? '',
              textAlign: TextAlign.start,
              style: TextStyle(
                  fontSize: Theme.of(context).textTheme.titleSmall!.fontSize,
                  fontWeight: FontWeight.w500),
              maxLines: 2,
              overflow: TextOverflow.ellipsis,
            ),
            const Spacer(),
            if (videoItem.rcmdReason != null &&
                (videoItem.rcmdReason?.content?.isNotEmpty ?? false))
              Container(
                padding: const EdgeInsets.symmetric(vertical: 2, horizontal: 5),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(4),
                  border: Border.all(
                      color: Theme.of(context).colorScheme.surfaceTint),
                ),
                child: Text(
                  videoItem.rcmdReason?.content ?? '',
                  style: TextStyle(
                      fontSize: 9,
                      color: Theme.of(context).colorScheme.surfaceTint),
                ),
              ),
            const SizedBox(height: 4),
            Row(
              children: [
                Text(
                  videoItem.owner?.name ?? '',
                  style: TextStyle(
                    fontSize: Theme.of(context).textTheme.labelSmall!.fontSize,
                    color: Theme.of(context).colorScheme.outline,
                  ),
                ),
              ],
            ),
            Row(
              children: [
                StatView(
                  theme: 'gray',
                  view: videoItem.stat?.view,
                ),
                const SizedBox(width: 8),
                Text(
                  Utils.dateFormat(videoItem.pubdate ?? ''),
                  style: TextStyle(
                      fontSize: 11,
                      color: Theme.of(context).colorScheme.outline),
                )
              ],
            ),
          ],
        ),
      ),
    );
  }
}
